/*1.做背景图：可以移动*/
body{
	/*背景复合属性：路径地址：相对路径+图片名称*/
	background: url(../img/bg.jpg) no-repeat;
	/*背景图尺寸属性：数值px或者%  高度x轴  宽度y轴*/
	background-size: 100% 723px;
}
/*2.标题*/
h1{
	/*文字放大*/
	font-size: 55px;
	/*文本字体：华文彩云*/
	font-family: "华文彩云";
	/*文字加粗*/
	font-weight: 500;
	/*文字阴影*/
	text-shadow: 5px 5px 5px #ffffff;
	/*文字颜色*/
	color: #fffae8;
	/*透明度*/
	opacity: 0.8;
}
/*3.熊 --空间+背景图--移动*/
#bear{
	width: 400px;
	height: 400px;
	border: 1px solid red;
	/*背景图*/
	background: url(../img/bear_1.png) no-repeat;
	/*背景图占满整个空间*/
	background-size: 100% 100%;
	/*定位*/
	position: relative;
	top: -153px;
	left: -63px;
	/*启动动画*/
	animation: bear 10s linear infinite;
}

/*创建关键帧：背景图改变：位置改变*/
@keyframes bear{
	0%{
		/*第一组必须为原始位置*/
		background: url(../img/bear_1.png) no-repeat;
		/*背景尺寸*/
		background-size: 100% 100%;
		top: -153px;
		left: -63px;
		transform: rotate(1800deg) scale(0.8);
		/**/
	}
	10%{
		background: url(../img/bear_1.png) no-repeat;
		background-size: 100% 100%;
		top: 200px;
		left: 15px;
		transform: rotate(1600deg) scale(0.8);
	}
	20%{
		background: url(../img/bear_2.png) no-repeat;
		background-size: 100% 100%;
		top: -202px;
		left: 103px;
		transform: rotate(1860deg) scale(0.8);
	}
	30%{
		background: url(../img/bear_3.png) no-repeat;
		background-size: 100% 100%;
		top: 303px;
		left: 203px;
		transform: rotate(1772deg) scale(0.8);
	}
	40%{
		background: url(../img/bear_4.png) no-repeat;
		background-size: 100% 100%;
		top: -223px;
		left: 350px;
		transform: rotate(1785deg) scale(0.8);
	}
	50%{
		background: url(../img/bear_5.png) no-repeat;
		background-size: 100% 100%;
		top: 323px;
		left: 280px;
		transform: rotate(1452deg) scale(0.8);
	}
	60%{
		background: url(../img/bear_6.png) no-repeat;
		background-size: 100% 100%;
		top: -266px;
		left: 406px;
		transform: rotate(1645deg) scale(0.8);
		}
	70%{
		background: url(../img/bear_7.png) no-repeat;
		background-size: 100% 100%;
		top: 388px;
		left: 565px;
		transform: rotate(1849deg) scale(0.8);
	}
	80%{
		background: url(../img/bear_8.png) no-repeat;
		background-size: 100% 100%;
		top: -333px;
		left: 682px;
		transform: rotate(1261deg) scale(0.8);
	}
	90%{
		background: url(../img/bear_9.png) no-repeat;
		background-size: 100% 100%;
		top: 367px;
		left: 766px;
		transform: rotate(1364deg) scale(0.8);
	}
	100%{
		background: url(../img/bear_10.png) no-repeat;
		background-size: 100% 100%;
		top: -313px;
		left: 844px;
		transform: rotate(1786deg) scale(0.8);
	}
}